<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>05.常用请求方法和数据提交</title>
</head>

<body>
  <button class="btn">注册用户</button>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <script>
    /*
      注册用户: http://hmajax.itheima.net/api/register
      请求方法: POST
      参数名:
        username: 用户名 (中英文和数字组成, 最少8位)
        password: 密码 (最少6位)

      目标: 点击按钮, 通过axios提交用户和密码, 完成注册
    */
    document.querySelector('.btn').addEventListener('click', function () {
      axios({
        method: 'post',
        url: 'http://hmajax.itheima.net/api/register',
        data: {
          username: '1233455',
          password: '11111111'
        }
      }).then(res => {
        // 成功
        console.log(res)
      }).catch(err => {
        // 失败
        console.log(err)
        console.log(err.response.data.message)
        alert(err.response.data.message)
      })
    })

  </script>
</body>

</html>